<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--bootstrap插件-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="/static/plugin/bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="/static/plugin/jo/joUI.css" rel="stylesheet"/>
    <!--字体插件-->
    <link href="/static/plugin/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/static/plugin/layui-2.4.3/css/layui.css" rel="stylesheet"/>
    <!--ztree-->
    <link href="/static/plugin/zTree/css/metroStyle/metroStyle.css" rel="stylesheet"/>
    <!--common-->
    <link href="/static/css/common.css" rel="stylesheet"/>
    <title>投票主信息表单</title>
</head>
<body>
<div class="container-fluid">
    <div class="row" id="tabDiv" style="display: none;">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
            <ul class="nav nav-tabs" role="tablist" id="tab-option">
                <li class="active" role="presentation">
                    <a data-toggle="tab" href="#baseInfo" aria-controls="exampleTabsInverseOne" role="tab" aria-expanded="true">
                        基本信息
                    </a>
                </li>
                <li role="presentation" class="">
                    <a data-toggle="tab" href="#optionInfo" aria-controls="exampleTabsInverseTwo" role="tab" aria-expanded="false">
                        选项信息
                    </a>
                </li>
                <li role="presentation" class="">
                    <a data-toggle="tab" href="#person" aria-controls="exampleTabsInverseThree" role="tab" aria-expanded="false">
                        关联用户
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <div class="tab-content">
        <!--基本信息-->
        <div class="tab-pane active" id="baseInfo" role="tabpanel">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <!--按钮栏-->
                    <div class="form-group button-bar button-bar">
                        <button type="button" isShow="joForm.isAdd" class="btn btn-primary" onclick="joForm.save()">
                            <i class="fa fa-plus-circle" aria-hidden="true"></i>&nbsp;新增
                        </button>
                        <button type="button" isShow="!joForm.isAdd" class="btn btn-info" onclick="joForm.update()">
                            <i class="fa fa-pencil-square" aria-hidden="true"></i>&nbsp;修改
                        </button>
                        <button type="button" isShow="!joForm.isAdd" class="btn btn-danger" onclick="joForm.del()">
                            <i class="fa fa-trash" aria-hidden="true"></i>&nbsp;删除
                        </button>
                    </div>
                    <!--按钮栏-->
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <form id="pageForm" name="pageForm" action="" method="post">
                        <!--<div class="young-form-item col-md-6">
                            <div class="young-form-label">投票信息编号</div>
                            <div class="young-form-tips"></div>
                            <div class="young-form-input-block">
                                <input type="text"   name="id" value="" class="form-control " readonly />
                            </div>
                        </div>-->
                        <div class="young-form-item col-md-6 must">
                            <div class="young-form-label">标题</div>
                            <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('例如:小组长投票选举',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                            <div class="young-form-input-block">
                                <input type="text"   name="title" value="" class="form-control "  ErrEmpty="标题不允许为空" />
                            </div>
                        </div>
                        <div class="young-form-item col-md-6 ">
                            <div class="young-form-label">内容</div>
                            <div class="young-form-tips"></div>
                            <div class="young-form-input-block">
                                <textarea  name="content" value="" class="form-control "   ></textarea>
                            </div>
                        </div>
                        <div class="young-form-item col-md-6 must">
                            <div class="young-form-label">起始时间</div>
                            <div class="young-form-tips"></div>
                            <div class="young-form-input-block">
                                <input type="text" id="startTime" value="" name="startTime" class="form-control "  ErrEmpty="起始时间不允许为空" />
                            </div>
                        </div>
                        <div class="young-form-item col-md-6 must">
                            <div class="young-form-label">结束时间</div>
                            <div class="young-form-tips"></div>
                            <div class="young-form-input-block">
                                <input type="text" id="endTime" value="" name="endTime" class="form-control "  ErrEmpty="结束时间不允许为空" />
                            </div>
                        </div>
                        <div class="young-form-item col-md-6 ">
                            <div class="young-form-label">创建时间</div>
                            <div class="young-form-tips"></div>
                            <div class="young-form-input-block">
                                <input type="text" id="createTime" value="" name="createTime" class="form-control " readonly  />
                            </div>
                        </div>
                        <div class="young-form-item col-md-6 ">
                            <div class="young-form-label">修改时间</div>
                            <div class="young-form-tips"></div>
                            <div class="young-form-input-block">
                                <input type="text" id="updateTime" value="" name="updateTime" class="form-control " readonly  />
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!--选项信息-->
        <div class="tab-pane" id="optionInfo" role="tabpanel">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <!--按钮栏-->
                    <div class="form-group button-bar">
                        <button type="button" class="btn btn-primary" onclick="addOption()">
                            <i class="fa fa-plus" aria-hidden="true"></i>&nbsp;新增
                        </button>
                        <button type="button" class="btn btn-danger" onclick="joView.del()">
                            <i class="fa fa-trash-o" aria-hidden="true"></i>&nbsp;删除
                        </button>
                    </div>
                    <!--/按钮栏-->
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover" id="mainList"  deleteUrl="/bs/vote/voteOption/delete" formUrl="/page/vote/voteOptionForm.html">
                            <col field="id" title="选项编号" width="45%" align="" event="click" />
                            <col field="optionContent" title="选项内容" width="50%" align=""  />
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <!--用户信息-->
        <div class="tab-pane" id="person" role="tabpanel">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <!--按钮栏-->
                    <div class="form-group button-bar">
                        <button type="button" class="btn btn-primary" onclick="relevanceUser()">
                            <i class="fa fa-plus" aria-hidden="true"></i>&nbsp;关联用户
                        </button>
                    </div>
                    <!--/按钮栏-->
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover" id="personList" trHandle="trHandle">
                            <col field="_seq" title="#" width="5%" align=""  />
                            <col field="userId" title="用户编号" width="40%" align=""  />
                            <col field="userName" title="关联用户" width="35%" align=""  />
                            <col field="_opt" title="操作" width="20%" align=""  />
                        </table>
                    </div>
                </div>
            </div>
        </div>

    </div>

</div>

<!--配置信息-->
<script src="/static/js/config.js"></script>
<!--jquery-->
<script src="/static/plugin/jquery/jquery-3.3.1.js"></script>
<script src="/static/plugin/jquery/jquery.cookie.js"></script>
<!--bootstrap-->
<script src="/static/plugin/bootstrap/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!--[if lt IE 9]>
<script src="/static/plugin/other/html5shiv.js"></script>
<script src="/static/plugin/other/respond.min.js"></script>
<![endif]-->
<!--layui-->
<script src="/static/plugin/layui-2.4.3/layui.all.js"></script>
<!--ztree-->
<script src="/static/plugin/zTree/js/jquery.ztree.all.js"></script>
<!--common-->
<script src="/static/js/common.js"></script>
<!--jo-->
<script src="/static/plugin/jo/jo.js"></script>
<script src="/static/plugin/jo/jo-adapt.js"></script>
<script src="/static/plugin/jo/jo-page-view.js"></script>
<script src="/static/plugin/jo/jo-page-form.js"></script>
<script src="/static/plugin/jo/jo-listener.js"></script>
<script type="text/javascript">
    layui.laydate.render({
        elem: '#startTime' //注册日期控件
    });
    layui.laydate.render({
        elem: '#endTime' //注册日期控件
    });
    /*layui.laydate.render({
        elem: '#createTime' //注册日期控件
    });
    layui.laydate.render({
        elem: '#updateTime' //注册日期控件
    });*/
    $(function(){
        var jParams = {
            "PKName" : "id",//主键属性名
            "saveAfter" : "toEdit",
            "addUrl" : "/bs/vote/voteInfo/insert",//新增
            "deleteUrl" : "/bs/vote/voteInfo/delete",//删除
            "updateUrl" : "/bs/vote/voteInfo/update",//修改
            "formDataUrl" : "/bs/vote/voteInfo/get",//查询
            //"readonly2Label" : true //只读转文本
        };
        joForm.initFormPage(jParams);//初始化
    });
    //初始化新增页面回调函数(在初始化按钮前发生)
    joForm.initFormPageOfAdd = function(){

    };
    //初始化表单值前处理
    joForm.initFormValueBefore = function(oJson){
        oJson.startTime = jo.formatDate(oJson.startTime);
        oJson.endTime = jo.formatDate(oJson.endTime);
        oJson.createTime = jo.formatTime(oJson.createTime);
        oJson.updateTime = jo.formatTime(oJson.updateTime);
    };
    //初始化表单值后处理
    joForm.initFormValueAfter = function(oJson){
        $('#tabDiv').slideDown();
        //编辑页,根据投票主id查询选项信息列表
        if(!joForm.isAdd && joForm.params.PKValue){
            joView.init({grid:$("#mainList"),PKName:"id", dataUrl:"/bs/vote/voteOption/getList?voteId=" + joForm.params.PKValue, formWidth:'80%', formHeight: '280px'});//初始化页面
            //加载关联用户
            loadPerson();

        }
    };
    //新增请求提交前回调函数
    joForm.dealDataAtSaveBefore = function(oJson){

    };
    //修改请求提交前回调函数
    joForm.dealDataAtUpdateBefore = function(oJson){

    };
    /* 关于joForm更多回调函数和配置参数可查看jo-page-form.js */



    //表格渲染时行处理,参数1为当前行的数据对象,参数2为当前行的索引值(最小为0)
    joView.handleItem = function(oItem,iIndex){

    };
    //表格渲染完成后的回调,参数为表格数据(数组对象)
    joView.setGridDataAfter = function(oList){

    };
    function addOption(){
        if(!joForm.isAdd && joForm.params.PKValue){
            joView.setTransferParam('voteId=' + joForm.params.PKValue);
            joView.add();
        }
    }


    function relevanceUser(){
        if(joForm.isAdd || !joForm.params.PKValue){
            jo.showErrorMsg('投票信息无效');
            return;
        }
        jo.showDialog('<ul class="ztree" id="companyUserTreeWin"></ul>', 'companyUserTreeWin', true, {title:'选择用户', area:['400px','450px'], btn:["确定", "取消"], btnAlign:'c', success:function(){
            createCompanyUserTree('companyUserTreeWin', null, true);//创建可选的单位用户树
        }, btn1: function(idx){
            var checkedNodes = jo.getZTreeCheckedNodes('companyUserTreeWin');
            var ids = '';//勾选的用户信息
            for(var i=0;i<checkedNodes.length;i++){
                var node = checkedNodes[i];
                if(node.nodeType == 'USER'){
                    ids += ',' + node.id;
                }
            }
            if(ids){
                ids = ids.substring(1);
            }
            if(!ids){
                jo.showMsg('请选择待添加的用户', {icon:0});
                return;
            }
            jo.postAjax('/bs/vote/votePerson/batchInsert', {voteId:joForm.params.PKValue, userIds:ids}, function(json){
                if(json && json.code == 0){
                    jo.showMsg('关联成功', {icon:1});
                    Grid('personList').loadData('/bs/vote/votePerson/getList?voteId=' + joForm.params.PKValue);
                }else if(json && json.code == -1){
                    jo.showMsg(json.info, {icon:2});
                }else{
                    jo.showMsg('关联失败', {icon:2});
                }
            }, true);
            jo.close(idx);
        }});
    }
    function loadPerson(){
        Grid('personList').loadData('/bs/vote/votePerson/getList?voteId=' + joForm.params.PKValue);
    }

    function trHandle(item){
        item['_opt'] = '<button type="button" class="btn btn-danger btn-sm" onclick="removePerson(\''+item.id+'\')"><i class="fa fa-trash" aria-hidden="true"></i>&nbsp;移除</button>';
    }
    function removePerson(sid){
        if(!sid){
            jo.showTipsMsg('请选中待移除用户!');
            return;
        }
        jo.confirm('您确定移除此用户吗?', function(idx){
            jo.postAjax('/bs/vote/votePerson/delete', {id: sid}, function (json) {
                if(json && json.code == 0) {
                    jo.showSuccessMsg('操作成功');
                    loadPerson();
                }else{
                    jo.showErrorMsg('操作失败');
                }
            });
            jo.close(idx);
        });

    }
</script>
</body>
</html>
